<template>
  <div class="packet-pickup-date-dialog">
    <el-dialog
      title="确认取件日期"
      :visible.sync="visible"
      width="500px"
    >
      <div class="tips red">{{ $t('确认取件日期生成运单后即可打印面单') }}</div>
      <el-date-picker
          v-model="pickupDate"
          type="date"
          placeholder="选择日期"
          class="mgt20"
      >
      </el-date-picker>
      <div class="buttons mgt20">
        <el-button @click="visible=false;">{{ $t('取消') }}</el-button>
        <el-button type="primary" @click="submit">{{ $t('确定') }}</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {dateFormat} from "@/utils";
import {getTargetDate, getTargetTimezone} from "@/utils/common";
import {createShippingOrder} from "@/api/order";

export default {
  computed: {

  },
  data() {
    return {
      visible: false,
      pickupDate: '',
    }
  },
  watch: {
    visible(val) {
      if (val) {
        this.dataInit();
      }
    }
  },
  created() {
    this.dataInit();
  },
  methods: {
    dataInit() {
      // 默认今天
      const date = getTargetDate(getTargetTimezone())
      this.pickupDate = dateFormat('Y-m-d', date);
    },
    show(orderId) {
      return new Promise((resolve, reject) => {
        this.visible = true;
        this.submit = () => {
          this.submitPickupDate(orderId)
              .then(resolve)
              .catch(reject);
        }
      });
    },
    submit() {

    },
    submitPickupDate(orderId) {
      return new Promise((resolve, reject) => {
        if (!orderId) {
          this.$message.error(this.$t('请选择'));
          return;
        }
        const data = {
          pickupDate: this.pickupDate,
        };
        createShippingOrder(orderId, data)
          .then(res => {
            this.visible = false;
            resolve(this.pickupDate);
          })
            .catch(error => {
              reject(error);
            });
      });
    },
  }
}
</script>

<style scoped lang="less">
.tips{
  &.red{
    color: red;
  }
}
.buttons{
  text-align: right;
}
</style>
